<template>
    <div class="app">
        <merchantHeader/>
        <div class="back">
            <div class="con">
              <div class="pxes"></div>
              <div class="listneo">
                <businessL/>
                <div class="conres">
                  <el-form style="margin-top: 20px;border-bottom: solid 1px rgb(220,220,220);margin-left: 20px;" :inline="true" class="demo-form-inline">
                    <el-form-item>
                      <div>全部活动：</div>
                    </el-form-item>
                    <el-form-item label="类别">
                      <el-select size="medium" v-model="value" placeholder="类别">
                        <el-option
                          v-for="item in options"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item label="状态">
                      <el-select size="medium" v-model="values" placeholder="状态">
                        <el-option
                          v-for="item in optionstow"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value">
                        </el-option>
                      </el-select>
                    </el-form-item>
                    <el-form-item>
                      <el-button size="small" type="danger">查询</el-button>
                    </el-form-item>
                  </el-form>
                  
                  <!-- 一个商品块 -->
                  <div class="boxs">
                    <div class="boxs_t">
                      <div class="boxs_img">
                        <img src="@/assets/img/aa.png" alt />
                      </div>
                    </div>
                    <div class="boxs_cent">
                      <div class="boxs_cent_one">
                        <div class="btn">新品首发</div>
                        <span style="line-height:30px">(已结束)</span>
                        <div class="btn1">博格真皮百搭款女包</div>
                      </div>
                      <div class="boxs_cent_one">
                        <div>市场价格:<span>{{jine}}元</span></div>
                        <div style="margin-left:20px">首发价格:<span>{{jine}}元</span></div>
                      </div>
                      <div>预定金额:<span>{{jine}}元</span></div>
                      <div>预定时间:<span>2001.01.01</span></div>
                      <div>尾款支付时间:<span>2001.01.01</span></div>
                      <div>申请时间:<span>2001.01.01</span></div>
                    </div>
                    <div class="boxs_t">
                      <div class="boxs_img">
                        <p style="text-align: center;line-height:15px">审核成功</p>
                      <el-button round class="boxs_tb" size="mini" @click="$router.push('/bu41details?types='+'3')">查看详情</el-button>
                      <el-button round class="boxs_tb" size="mini" @click="$router.push('/buhdbb')">活动报表</el-button>
                      </div>
                    </div>
                  </div>
                  <!-- 第二个商品块 -->
                  <div class="boxs">
                    <div class="boxs_t">
                      <div class="boxs_img">
                        <img src="@/assets/img/aa.png" alt />
                      </div>
                    </div>
                    <div class="boxs_cent">
                      <div class="boxs_cent_one">
                        <div class="btn">新品首发</div>
                        <div class="btn1">博格真皮百搭款女包</div>
                      </div>
                      <div class="boxs_cent_one">
                        <div>市场价格:<span>{{jine}}元</span></div>
                        <div style="margin-left:20px">首发价格:<span>{{jine}}元</span></div>
                      </div>
                      <div>预定金额:<span>{{jine}}元</span></div>
                      <div>预定时间:<span>2001.01.01</span></div>
                      <div>尾款支付时间:<span>2001.01.01</span></div>
                      <div>申请时间:<span>2001.01.01</span></div>
                    </div>
                    <div class="boxs_t">
                      <div class="boxs_img">
                        <p style="text-align: center;line-height:15px">审核中，请耐心等待</p>
                      <el-button round class="boxs_tb" size="mini">查看详情</el-button>
                      <el-button round class="boxs_tb" size="mini">保证金缴纳</el-button>
                      </div>
                    </div>
                  </div> 
                  <div class="feny">
                        <el-pagination
                          background
                          layout="prev, pager, next"
                          :total="1000"
                          style="margin-top: 5px;">
                        </el-pagination>
                        第<el-input size="mini" style="width: 50px;"></el-input>页
                        <button style="height: 28px;border-radius: 4px;background-color: #fff;border: 1px solid #DCDFE6;margin-top: 6px;background-color: #409EFF;color: #FFF;">跳转</button>
                      </div> 
                  <businessF/>
                </div>
              </div>
              
            </div>
        </div>
        <Footer/>
    </div>
</template>
<script>
import merchantHeader from '@/components/merchantHeader'
import Footer from '@/components/Footer'
import businessL from '@/components/businessL'
import businessF from '@/components/businessF'
import { activity_list } from '@/apiUrl/busslogin'
export default {
    components: { 
    merchantHeader,
    Footer,
    businessL,
    businessF
    },
    data() {
      return {
        jine:50,
       options: [{
          value: '1',
          label: '免费体检活动'
        }, {
          value: '2',
          label: '价格竞猜活动'
        }, {
          value: '3',
          label: '新品首发活动'
        }],
        optionstow: [{
          value: '1',
          label: '发起新活动'
        }, {
          value: '2',
          label: '待审核活动'
        }, {
          value: '3',
          label: '审核成功活动'
        }, {
          value: '4',
          label: '正在进行活动'
        },{
          value: '5',
          label: '待定价活动'
        }, {
          value: '6',
          label: '已结束活动'
        }, {
          value: '7',
          label: '审核失败活动'
        }],
        values: '',
        value: ''
      }
      
    },
    mounted(){
      this.listdata()
    },
    methods: {
      
      listdata(){
        var datas={
          activityType:"",//活动类型
          status:"",//活动状态 0 : 未审核 1 : 审核通过 2 : 审核失败
          timeStatus:"",//活动状态 0 :即将进行 1 : 正在进行 2 : 结束
          current:"1",//当前页 （必填）
          size:"10",//页码 （必填）
        };
        activity_list(datas).then(res=>{
          console.log(res)
        })
      }
    },
}
</script>
<style scoped>
.app  /deep/  .ist_l .ist_c li:nth-child(1) {
    background-color: #ff9381;
    width: 126px;
    height: 50px;
    display: block;
}
.back {
    background-color: #f06048
}
.pxes {
  height: 15px;
}
.back .con {
  width: 1200px;
  margin: 0 auto;
  background-color: #eee;
  padding-bottom: 10px;
} 
.listneo {
  width: 1161px;
  margin: 0px auto;
  display: flex;
  justify-content: space-between;
}
.conres {
  width: 902px;
  border-radius: 6px;
  background-color: #fff
}
.boxs{
  display: flex;
  width: 100%;
  border-bottom:solid 1px rgb(220, 220, 220);;
}
.boxs_t{
  width: 170px;
  height: 170px;
}
.boxs_cent{
  flex: 1;
  margin: 22px 0px 22px 15px;
}
.boxs_cent_one{
  display: flex;
}
.btn{
  background-color: green;
  color:white;
  width: 100px;
  text-align: center;
  height: 30px;
  line-height: 30px;
  border-radius: 20px;
}
.btn1{
  line-height:30px;
  font-size: 18px;
  font-weight: 600;
  margin-left: 10px;
}
.boxs_img{
   width: 126px;
  height: 126px;
  margin: 22px auto;
}
.boxs_img img{
  width: 126px;
  height: 126px;
}
.boxs_tb{
  width: 118px;
  margin: 10px auto;
  display: block;
}
.feny{
  display: flex;
  line-height: 40px;
  justify-content: center;
  width: 70%;
  margin: 0 auto;
}
</style>